{% extends 'base_backend.html' %}
{% load static %}
{% load my_filter %}

{% block header_tail %}
<link rel="stylesheet" href="{% static 'zhongbao/zhongbao_admin/css/style.css' %}">
<link rel="stylesheet" href="{% static 'zhongbao/zhongbao_admin/css/iconfont.css' %}">
<link rel="stylesheet" href="{% static 'plugins/datatables/dataTables.bootstrap.css' %}">
<link rel="stylesheet" href="{% static 'public/ComboSelect/css/combo.select.css' %}">
<link rel="stylesheet" href="{% static 'zhongbao/config/css/main.css' %}">
<link rel="stylesheet" href="{% static 'laydate/theme/default/laydate.css' %}">
<script src="{% static 'laydate/laydate.js' %}"></script>
<script src="{% static 'plugins\jQuery\jquery-2.2.3.min.js' %}"></script>

<script src="{% static 'plugins/vue1/vue.js' %}"></script>

{% endblock header_tail %}

{% block section_content %}

<div>
    <div class="box-header with-border">
        <h3 class="box-title">
            微信点赞任务
        </h3>
    </div>
    <!-- form start -->
    <div class="box box-primary">
        <div class="box-header with-border" style="border-color: #1b6d85">
            <!-- Date range -->
            <form role="form" id="searchForm" method="get" action="">
                <input name="author" type="hidden" class="config-input" value="{{ author }}">
                <div style="width: 95%; float: left;">
                    <div style="float: left;" class="input-group select-config-div">
                        <label for="taskId" class="control-label">主任务ID：</label>
                        <input id="taskId" type="text" name="taskId" class="config-input">
                    </div>
                    <div style="float: left;" class="input-group select-config-div">
                        <label for="sub_taskId" class="control-label">用户ID：</label>
                        <input id="userId" type="text" name="userId" class="config-input">
                    </div>
                    <div style="float: left;" class="input-group select-config-div">
                        <label for="url" class="control-label">任务URL：</label>
                        <input id="url" type="text" name="url" class="config-input">
                    </div>
                    <div style="float: left;" class="input-group select-config-div">
                        <label for="audit_status" class="control-label">状态：</label>
                        <select name="audit_status" id="audit_status" class="config-input">
                            <option value="">----------</option>
                            {% for state in audit_status_list %}
                            {% if audit_status == state.code %}
                            <option selected="selected" value="{{ state.code }}">{{ state.name }}</option>
                            {% else %}
                            <option value="{{ state.code }}">{{ state.name }}</option>
                            {% endif %}
                            {% endfor %}
                        </select>
                    </div>
                    <div style="float: left;" class="input-group select-config-div">
                        <label for="audit_status" class="control-label">是否过期：</label>
                        <select name="is_late" id="is_late" class="config-input">
                            {% for late in is_late_list %}
                            {% if is_late == late.code %}
                            <option selected="selected" value="{{ late.code }}">{{ late.name }}</option>
                            {% else %}
                            <option value="{{ late.code }}">{{ late.name }}</option>
                            {% endif %}
                            {% endfor %}
                        </select>
                    </div>
                    <div style="float: left;" class="input-group select-config-div">
                        <label for="audit_status" class="control-label">任务类型：</label>
                        <select name="task_type" id="task_type" class="config-input">
                            <option value="">----------</option>
                            {% for ttype in task_type_list %}
                            {% if task_type == ttype.code %}
                            <option selected="selected" value="{{ ttype.code }}">{{ ttype.name }}</option>
                            {% else %}
                            <option value="{{ ttype.code }}">{{ ttype.name }}</option>
                            {% endif %}
                            {% endfor %}
                        </select>
                    </div>
                    <div style="float: left;" class="input-group select-config-div">
                        <label for="id" class="control-label">每页显示：</label>
                        <select name="limit" id="showNumSelect" class="config-input">
                            {% for i in limits %}
                            {% if i == limit %}
                            <option selected="selected" value="{{ i }}">{{ i }}条</option>
                            {% else %}
                            <option value="{{ i }}">{{ i }}条</option>
                            {% endif %}
                            {% endfor %}
                        </select>
                    </div>
                </div>
                <div class="input-group" style="width: 5%; float: right; margin-top: 70px;">
                    <input type="submit" class="form-control pull-left btn btn-sm btn-primary" value="检索">
                </div>
            </form>
        </div>
        <!-- 展示搜索出来的任务 -->
        <div id="main">
            <div class="box-body">
                <form id="model_form" role="form" method="post">{% csrf_token %}
                    <div class="group">
                        <table id="task_each_table" border="1" class="table table-bordered table-hover table-striped">
                            <thead>
                            <tr>
                                <th>
                                    <span style="float: left">
                                        主任务ID
                                    </span>
                                </th>
                                <th>
                                    <span style="float: left">
                                        用户ID
                                    </span>
                                </th>
                                <th>
                                    <span style="float: left">
                                        描述（序号 | URL | 任务类型 | 次数）
                                    </span>
                                </th>
                                <th>
                                    <span style="float: left">
                                        截止时间
                                    </span>
                                </th>
                                <th>
                                    <span style="float: left">
                                        操作
                                    </span>
                                </th>
                            </tr>
                            </thead>
                            <tbody>
                            {% for task in task_list %}
                            <tr>
                                <td>{{ task.taskId }}</td>
                                <td title="{{ task.user }}">{{ task.user }}</td>
                                <td>
                                    {% for i in task.detail %}
                                    <p>
                                        <span>（{{ forloop.counter }}）</span>
                                        <span>{{ i.url }}</span>
                                        <span>|</span>
                                        <span>{{ i.type | wx_task_type }}</span>
                                        <span>|</span>
                                        <span>{{ i.num }}次</span>
                                    </p>
                                    {% endfor %}
                                </td>
                                <td>{{ task.deadline_time | timestamp_format:'%Y-%m-%d %H:%M:%S' }}</td>
                                <td>
                                    {% if manage_type == 'task_manager' %}
                                    <a class="btn btn-info btn-xs" onclick="del_task('{{ task.taskId }}')">删除</a>
                                    {% endif %}
                                    {% if manage_type == "market" %}
                                    <a class="btn btn-info btn-xs" onclick="_receive_task('{{ task.taskId }}')">领取任务</a>
                                    {% endif %}
                                    {% if manage_type == "my" %}
                                    <a href="{% url 'WeChatTask:task_detail' %}?taskId={{ task.taskId }}"
                                       class="btn btn-info btn-xs">详情</a>
                                    {% endif %}
                                    {% if manage_type == "manage" %}
                                    <a href="{% url 'WeChatTask:add_img' %}?task_id={{ task.id }}"
                                       class="btn btn-info btn-xs">详情</a>
                                    {% endif %}
                                </td>
                            </tr>
                            {% endfor %}
                            </tbody>
                        </table>
                        <p class="" id="paginator">
                            <a class="btn btn-default btn-xs" onclick="toPage('home')">首页</a>
                            <a class="btn btn-default btn-xs" onclick="toPage('last')">上一页</a>
                            <a class="btn btn-default btn-xs" onclick="toPage('next')">下一页</a>
                            <input type="text" id="page-judge" style="width: 30px;height:20px; margin-left: 20px"
                                   onkeyup="toPage('judge')">
                            <a class="btn btn-default btn-xs" onclick="toPage('next')">尾页</a>
                            <a class="btn btn-default btn-xs" onclick="toPage('judge')">跳页</a>
                            <span v-show="total">共{{ count }}页</span>
                        </p>
                    </div>
                    <!-- /.box-footer -->
                    <div class="box-footer">
                        <button class="btn btn-primary no-display" id="submit_button">确认</button>
                        <button type="button" class="btn btn-primary" id="save_submit" name="_save"
                                style="display: none">sure
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="acceptNum" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" style="top:40%">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div id="msgBoxMsg" class="modal-body" style="overflow:auto;text-align:center;">
                任务ID
                <input type="text" id="accept_taskId" disabled>
                <br>
                请输入领取任务数量
                <input type="number" id="accept_num">
            </div>
            <div class="modal-footer" style="text-align:center;">
                <button type="button" class="btn btn-default" onclick="receive_task()"
                        data-dismiss="modal">确认
                </button>
                <button type="button" class="btn btn-default"
                        data-dismiss="modal">取消
                </button>
            </div>
        </div>
    </div>
</div>


<script>
    function changeColor(id, color) {
        //$(id).parent().parent().parent().children().children().children().find("li[color='green']");
        $(id).parent().parent().addClass("active");
        $(id).children().css("color", color);
    }

    if ("{{ manage_type }}" == "market") {
        changeColor('#WeChatTaskMarket', '#00FF7F');
    } else if ("{{ manage_type }}" == "my") {
        changeColor('#WeChatTaskMy', '#00FF7F');
    } else {
        changeColor('#WeChatTaskShow', '#00FF7F');
    }

    // 获取当前url参数值
    function GetQueryValue1(queryName) {
        var reg = new RegExp("(^|&)" + queryName + "=([^&]*)(&|$)", "i");
        var r = window.location.search.substr(1).match(reg);
        if (r != null) {
            return decodeURI(r[2]);
        } else {
            return null;
        }
    }

    // 翻页
    function toPage(type) {
        location_url = window.location.href;
        var page_num = GetQueryValue1('page');
        if (!page_num) {
            page_num = 1
        }
        if (type === 'last') {
            if (Number(page_num) > 1) {
                page_num = Number(page_num) - 1
            } else {
                page_num = 1
            }
        } else if (type === 'next') {
            page_num = Number(page_num) + 1
        } else if (type === 'judge') {
            page_num = $("#page-judge").val()
        } else if (type === 'home') {
            page_num = 1
        } else {
            alert('参数错误');
            return false;
        }
        var page = 'page=' + page_num;
        if (location_url.indexOf('page') !== -1) {
            window.location.href = location_url.replace(/page=\d+/, page)
        } else {
            if (location_url.indexOf('?') === -1) {
                window.location.href = location_url + '?' + page
            } else {
                window.location.href = location_url + '&' + page;
            }
        }
    }


    // 领取任务
    function _receive_task(taskId) {
        $("#accept_taskId").val(taskId);
        $("#acceptNum").modal();
    }

    // 领取任务
    function receive_task() {
        var taskId = $("#accept_taskId").val();
        var accept_num = $("#accept_num").val();
        $.post({
            url: "{% url 'WeChatTask:receive_task' %}",
            data: {
                csrfmiddlewaretoken: '{{ csrf_token }}',
                taskId: taskId,
                accept_num: accept_num,
            },
            success: function (resp) {
                if (resp.code == 1) {
                    alert(resp.message);
                    window.location.reload()
                } else {
                    alert(resp.message);
                    window.location.reload()
                }
            }
        })
    }

    // 删除
    function del_task(taskId){
        $.post({
            url: "{% url 'WeChatTask:del_tasks' %}",
            data: {
                csrfmiddlewaretoken: '{{ csrf_token }}',
                taskId: taskId,
            },
            success: function (resp) {
                if (resp.code == 0) {
                    window.location.reload()
                } else {
                    alert(resp.message);
                    window.location.reload()
                }
            }
        })
    }

    laydate.render({
        elem: '#testTime_range'
        , range: true
    });
</script>
{% endblock section_content %}
